<template>
  <div class="body">
    <MyHeader></MyHeader>
    <div class="time fz18 tf fw pr40 mt20" style="text-align: right">
      {{ datetime }}
    </div>
    <div class="dis_f fww jcsa mt10">
      <DataInfo></DataInfo>
      <DataInfo></DataInfo>
    </div>
    <div class="dis_f fww jcsa mt10">
      <DataDetail></DataDetail>
      <DataDetail></DataDetail>
    </div>
    <div class="dis_f fww jcsa mt10">
      <DataDetail></DataDetail>
      <DataDetail></DataDetail>
    </div>
    <div class="foot_title">
      <router-link to="/home">{{ system_info.sign_name }}</router-link>
    </div>
  </div>
</template>

<script setup>
import MyHeader from "../components/MyHeader.vue";
import TimeStatus from "../components/TimeStatus.vue";
import DataInfo from "../components/DataInfo.vue";
import DataDetail from "../components/DataDetail.vue";
import ws from "@/utils/socket.js";
import { ref, onMounted } from "vue";
//主动获取当前系统时间
let datetime = ref("");
function getTime() {
  let date = new Date();
  datetime.value = date.toLocaleString();
}
//定时1s
setInterval(getTime, 1000);
let system_info = ref({});
onMounted(() => {
  if (localStorage.getItem("system_info") !== null) {
    system_info.value = JSON.parse(localStorage.getItem("system_info"));
  }
});
</script>
<style lang="scss" scoped>
body,
html {
  margin: 0px;
  padding: 0px;
}
.body {
  position: absolute;
  width: 100%;
  min-height: 100%;
  background-image: linear-gradient(#2e3458, #1f4ce7, #2e3458);
  .foot_title {
    user-select: none;
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
    a {
      text-decoration: none;
      font-size: 15px;
      color: #d2ddf9;
    }
  }
}
</style>